<html ng-app>
<head>
<script type="text/javascript" src="./angular/angular.js"></script>

<style type="text/css">
.selected {
	background-color: lightgreen;
}
</style>


</head>
<body>

	<table ng-controller="RestaurantTableController">
		<tr ng-repeat="rest in directory" ng-click="selectRestaurant($index)"
			ng-class="{selected : $index == selectedRow}">

			<td>{{rest.name}}</td>
			<td>{{rest.cuisine}}</td>
		</tr>
	</table>



	<script type="text/javascript">
		function RestaurantTableController($scope) {
			$scope.directory = [ {
				name : 'The Handsome Heifei',
				cuisine : 'BBQ'
			}, {
				name : 'Green\'s Green',
				cuisine : 'Salads'
			}, {
				name : 'House of Fine Fish',
				cuisine : 'Seafood'
			} ];

			$scope.selectRestaurant = function(row) {
				$scope.selectedRow = row;
			};

		}
	</script>

</body>
</html>